<template>
  <div style="width: 100%;height: 100%">
    <div style="margin: 10px 0">
      <el-button type="primary" @click="addCourseOpen">添加选课</el-button>
      <el-button type="primary" @click="handleKick">一轮选课踢人</el-button>
    </div>
    <el-table
        :data="data"
        style="width: 100%">
      <el-table-column prop="id" label="Id"/>
      <el-table-column prop="courseName" label="课程名"/>
      <el-table-column prop="openOne" label="第一轮">
        <template #default="scope">
          <span>{{ scope.row.openOne ? '开启' : '关闭' }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="startTimeOne" label="第一轮开始时间"/>
      <el-table-column prop="endTimeOne" label="第一轮结束时间"/>
      <el-table-column prop="openOne" label="第二轮">
        <template #default="scope">
          <span>{{ scope.row.openTwo ? '开启' : '关闭' }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="startTimeTwo" label="第二轮开始时间"/>
      <el-table-column prop="startTimeTwo" label="第二轮结束时间"/>
      <el-table-column prop="options" label="操作">
        <template #default="scope">
          <el-button type="text" @click="update(scope.row)">修改</el-button>
        </template>
      </el-table-column>
    </el-table>

    <el-dialog v-model="start" title="选课" width="30%">

      <el-form :model="form">
        <el-form-item label="学期">
          <el-select v-model="form.termId" placeholder="请选择学期">
            <el-option
                v-for="item in term"
                :key="item.termid"
                :label="item.name"
                :value="item.termid">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="一轮选课开放">
          <el-radio-group v-model="form.openOne">
            <el-radio :label="true">开启</el-radio>
            <el-radio :label="false">关闭</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="第一轮开放时间">
          <el-date-picker
              v-model="form.startTimeOne"
              value-format="YYYY-MM-DD HH:mm:ss"
              type="datetime"
              placeholder="开始时间">
          </el-date-picker>
          <el-date-picker
              v-model="form.endTimeOne"
              value-format="YYYY-MM-DD HH:mm:ss"
              type="datetime"
              placeholder="结束时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="二轮选课开放">
          <el-radio-group v-model="form.openTwo">
            <el-radio :label="true">开启</el-radio>
            <el-radio :label="false">关闭</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="第二轮开放时间">
          <el-date-picker
              v-model="form.startTimeTwo"
              value-format="YYYY-MM-DD HH:mm:ss"
              type="datetime"
              placeholder="开始时间">
          </el-date-picker>
          <el-date-picker
              v-model="form.endTimeTwo"
              value-format="YYYY-MM-DD HH:mm:ss"
              type="datetime"
              placeholder="结束时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button style="width: 50%" type="primary" @click="save">保存修改</el-button>
        </el-form-item>
      </el-form>

    </el-dialog>
  </div>
</template>

<script>
import request from "@/utils/request";

export default {
  name: "CourseArrangement",
  data() {
    return {
      data: [],
      term: [],
      form: {
        openOne: false,
        openTwo: false
      },
      start: false
    }
  },
  created() {
    this.load()
  },
  methods: {
    addCourseOpen() {
      this.start = true
    },
    handleKick(){
      request.get("http://localhost:8082/selCourse/round1kick").then(res=>{
        this.data=res.data
        this.load()
      })
    },
    update(e) {
      this.form = JSON.parse(JSON.stringify(e))
      this.start = true
    },
    save() {
      request.post("http://124.70.179.188:8082/courseOpen", this.form).then(res => {
        this.$message({
          type: "success",
          message: "操作成功"
        })
      })
      this.start = false
      // this.load();
      location.reload()
    },
    load() {
      request.get("http://124.70.179.188:8082/courseOpen/list").then(res => {
        this.data = res.data
      })
      request.get("http://124.70.179.188:8082/term/list").then(res => {
        this.term = res.data
      })

    }
  }
}
</script>

<style scoped>

</style>